xui.Class("xui.UI.MTreeView", "xui.UI.TreeBar", {
    Initialize: function () {
        this.addTemplateKeys(['IMAGE']);
        var t = this.getTemplate();
        t.$submap.items.ITEM.BAR.className = 'xui-uitembg xui-uiborder-radius xui-showfocus {cls_group} {cls_fold} {_split} {disabled} {readonly}';
        var n = t.$submap.items.ITEM.BAR.ITEMICON;
        n.$fonticon = '{_fi_cls_file}';
        this.setTemplate(t);
    },
    Static: {

        Appearances: {
            ITEMS: {
                //overflow: 'visible'
                'padding': '.0em'
            },
            ITEM: {
                'white-space': 'nowrap',
                position: 'relative',
                'line-height': 1.22,
                //  padding: '0.25em 0 0.25em 0',
                'border-width': '1px',
                'border-bottom-style': 'solid',
                'border-color': '#DDDDDD',
                overflow: 'hidden'
            },
            MARK: {
                position: 'absolute',
                left: 'auto',
                top: '50%',
                'margin-top': '-0.5em',
                right: '.167em',
                $order: 12,
                color: "#3ed268",
                cursor: 'pointer',
                'vertical-align': 'middle'
            },
            BAR: {
                zoom: xui.browser.ie ? 1 : null,
                position: 'relative',
                height: "2em",
                'border-width': '1px',
                'border-top-style': 'solid',
                'border-color': '#DDDDDD',
                display: 'block',
                'outline-offset': '-1px',
                '-moz-outline-offset': (xui.browser.gek && xui.browser.ver < 3) ? '-1px !important' : null
            },
            SUB: {
                zoom: xui.browser.ie ? 1 : null,
                height: 0,
                'font-size': xui.browser.ie68 ? '1px' : null,
                //1px for ie8
                'line-height': xui.browser.ie68 ? '1px' : null,
                position: 'relative',
                overflow: 'hidden'
            },
            BOX: {
                left: '0em',
                overflow: 'auto',
                position: 'relative'
            }
        },
        Behaviors: {
            MARK: {
                onClick: function (profile, e, src) {
                    profile.box._onclickbar(profile, e, xui.use(src).parent().xid());
                    return false;
                }
            },
            ITEMICON: {
                onClick: function (profile, e, src) {
                    profile.box._onclickbar(profile, e, xui.use(src).parent().xid());
                    return false;
                }
            }
        },
        DataModel: {
            expression: {
                ini: '',
                action: function () {
                }
            },
            $subMargin: 1.8,
            group: null,
            noIcon: {
                ini: true,
                action: function (v) {
                    this.getSubNode("ITEMICON", true).css('display', v ? 'none' : '');
                }
            }
        },

        _initIconColors: function (type, p) {
            var colors = [],
                iconColors = ["#E6945C", "#46C37B", "#195ead", "#9E8CE0", "#1f8d9b", "#87CEEB", "#e04d7f"],
                fontColors = ["#E6945C", "#46C37B", "#195ead", "#9E8CE0", "#1f8d9b", "#87CEEB", "#e04d7f"],
                itemColors = ["#F19B60", "#49CD81", "#0277bd", "#A693EB", "#42a3af", "#B0E0E6", "#F06292"];

            switch (type) {
                case 'icon':
                    colors = iconColors;
                    if (p.iconColors && p.iconColors.length > 0) {
                        colors = p.iconColors;
                    }
                    break
                case 'font':
                    colors = fontColors;
                    if (p.fontColors && p.fontColors.length > 0) {
                        colors = p.fontColors;
                    }
                    break;
                case 'item':
                    colors = itemColors;
                    if (p.itemColors && p.itemColors.length > 0) {
                        colors = p.itemColors;
                    }
                    break;
            }
            return colors;
        },
        _autoColor: function (item, index, p) {
            index = index || 0;

            if (p.autoFontColor||item.fontColor) {
                var fontColors = this._initIconColors('font', p);
                while (index && index > (fontColors.length - 1)) {
                    index = index - fontColors.length;
                }

                if (!item.fontColor) {
                    item.fontColor = fontColors[index];
                }
                item._fontColor = item.fontColor ? ";color:" + item.fontColor : ''
            }

            if (p.autoIconColor||item.iconColor) {
                var iconColors = this._initIconColors('icon', p);
                while (index && index > (iconColors.length - 1)) {
                    index = index - iconColors.length;
                }
                if (!item.iconColor) {
                    item.iconColor = iconColors[index];
                }
                item._iconColor = item.iconColor ? ";color:" + item.iconColor : '';
            }
            if (p.autoItemColor||item.itemColor) {

                var itemColors = this._initIconColors('item', p);
                while (index && index > (itemColors.length - 1)) {
                    index = index - itemColors.length;
                }
                if (!item.itemColor) {
                    item.itemColor = itemColors[index]
                }
                item._itemColor = item.itemColor ? ";background-color:" + item.itemColor : ''
                item._fontColor = ';color:#ffffff'
                item._iconColor = ';color:#ffffff'
            }
        },
        _prepareItem: function (profile, item, oitem, pid, index, len) {
            var p = profile.properties,
                map1 = profile.ItemIdMapSubSerialId,
                map2 = profile.SubSerialIdMapItem,
                pitem;

            this._autoColor(item, index, p);

            if (item.fiCheck) {
                item._fi_check = item.fiCheck;
            } else {
                item._fi_check = 'xui-uimcmd-check';
            }

            if (pid) {
                oitem._pid = pid;
                if (pitem = map2[map1[pid]]) {
                    oitem._deep = pitem._deep + 1;
                    item.rulerStyle = 'width:' + (oitem._deep * p.$subMargin) + 'em;';
                    // for the last one
                    item._fi_togglemark = item.sub ? ('xui-uimcmd-toggle' + (item._checked ? '-checked' : '')) : (p.togglePlaceholder ? 'xui-uicmd-empty' : 'xui-uicmd-none');
                }
            } else {
                oitem._deep = 0;
                item.rulerStyle = '';
                item.innerIcons = '';
                item._fi_togglemark = item.sub ? ('xui-uimcmd-toggle' + (item._checked ? '-checked' : '')) : (p.togglePlaceholder ? 'xui-uicmd-empty' : 'xui-uicmd-none');
            }
            // show image
            item.imageDisplay = (item.noIcon || p.noIcon) ? "display:none;" : "";
            //
            item.cls_fold = item.sub ? profile.getClass('BAR', '-fold') : '';

            if (!(item.imageClass || item.image || item.iconFontCode))
                item._fi_cls_file = 'xui-icon-file' + (item.sub ? ' xui-icon-file-fold' : '');

            item._fi_optClass = p.optBtn;

            item.disabled = item.disabled ? 'xui-ui-disabled' : '';
            item._itemDisplay = item.hidden ? 'display:none;' : '';

            item.mark2Display = ('showMark' in item) ? (item.showMark ? '' : 'display:none;') : ((p.selMode == 'singlecheckbox' && !item.sub) || p.selMode == 'multibycheckbox') ? '' : 'display:none;';
            //          item.mark2Display = ('showMark' in item)?(item.showMark?'':'display:none;'):(p.selMode=='multi'||p.selMode == 'single'||p.selMode=='multibycheckbox')?'':'display:none;';

            item._tabindex = p.tabindex;
            this._prepareCmds(profile, item);

            if (item.type == 'split') {
                item._split = 'xui-uitem-split';
                item._splitstyle = 'margin-left:' + (oitem._deep * p.$subMargin) + 'em;';
                item._ruleDisplay = item._ltagDisplay = item._tglDisplay = item._rtagDisplay = item.imageDisplay = item.mark2Display = item._capDisplay = item._extraDisplay = item._optDisplay = 'display:none;';
            }
        },
        _tofold: function (profile, item, pid) {
            var cls = profile.getClass('IMAGE');
            profile.getSubNodeByItemId('BAR', pid).addClass(profile.getClass('BAR', '-fold'));
            profile.getSubNodeByItemId('TOGGLE', pid).replaceClass(new RegExp("\\b" + cls + "-path([-\\w]+)\\b"), cls + '-fold$1');
        }
    }
});
